import React from 'react';
import { Form } from 'antd';
import DragBodyRow from '../DragBodyRow';

import type { FormInstance } from 'antd/es/form';

export const EditableContext = React.createContext<FormInstance<any> | null>(
  null,
);

const EditableRow: React.FC<any> = ({ index, ...props }) => {
  const [form] = Form.useForm();

  return (
    <Form form={form} component={false}>
      <EditableContext.Provider value={form}>
        <DragBodyRow index={index} {...props} />
      </EditableContext.Provider>
    </Form>
  );
};

export default EditableRow;
